<template>
	<view class="main">
		<block v-if="type==1">
		<view class="item">
			<view class="lable">
				支付宝姓名
			</view>
			<view class="input">
				<u-input
				   placeholder="请输入内容"
				   v-model="form.alipay_name"
								border='false'
								type='text'
								placeholderStyle="color: #BBBBBB;font-size: 12px;"
								color="#ffffff"
								
				 ></u-input>
			</view>
		</view>
		<view class="item">
			<view class="lable">
				支付宝账号
			</view>
			<view class="input">
				<u-input
				   placeholder="请输入内容"
				   maxlength="11"
				   v-model="form.alipay_account"
								border='false'
								type='text'
								placeholderStyle="color: #BBBBBB;font-size: 12px;"
								color="#000"
								
				 ></u-input>
			</view>
		</view>
		</block>
		<block v-if="type==2">
			<view class="item">
				<view class="lable">
					开户行
				</view>
				<view class="input">
					<u-input
					   placeholder="请输入内容"
					   v-model="formc.bank_name"
									border='false'
									type='text'
									placeholderStyle="color: #BBBBBB;font-size: 12px;"
									color="#000"
									
					 ></u-input>
				</view>
			</view>
			<view class="item">
				<view class="lable">
					银行卡号
				</view>
				<view class="input">
					<u-input
					   placeholder="请输入内容"
					   v-model="formc.bank_account"
									border='false'
									type='text'
									placeholderStyle="color: #BBBBBB;font-size: 12px;"
									color="#000"
									
					 ></u-input>
				</view>
			</view>
			
		</block>
		
		<view class="btn">
			<u-button  size="small" :loading="loading" @click="toAdd" text="确定提交"></u-button>
		</view>
	</view>
</template>

<script>
		import { mapState, mapMutations } from 'vuex'
	export default {
		data() {
			return {
				form:{
					type:1
				},
				formc:{
					type:2
				},
				type:1,
				loading:false
			}
		},
		computed: {
			...mapState(['userInfo'])
		},
		onLoad(e){
			this.type=e.type
			let user=this.userInfo
			if(this.type==1){
			this.form.alipay_name=user.alipay_name
			this.form.alipay_account=user.alipay_account}
			if(this.type==2){
			this.formc.bank_name=user.bank_name
			this.formc.bank_account=user.bank_account}
		},
		methods: {
		async toAdd(){
			if(this.type==1){
				if(!this.form.alipay_name){
					this.$u.toast('请输入支付宝姓名')
					return
				}
				if(!this.form.alipay_account){
					this.$u.toast('请输入支付宝账户')
					return
				}
				}else{
				if(!this.formc.bank_name){
					this.$u.toast('请输入开户行')
					return
				}
				if(!this.formc.bank_account){
					this.$u.toast('请输入银行卡号')
					return
				}
				}
				this.loading=true
				let data = await this.$http({
					url:this.$api.payMent,
					method: 'POST',
					hideLoading: true,
					needToken:true,
					data:this.type==1?this.form:this.formc
				})
				this.loading=false
				if(data.code==201){
					uni.redirectTo({
						url:'/pages/wallet/withdraw'
					})
				}else{
					this.$u.toast(data.msg)
				}
				
			
			},
		}
	}
</script>

<style lang="scss" scoped>
.main{
	padding:0 32rpx;
	.item{
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 54rpx 0 14rpx 0;
		border-bottom: 1px solid #333333;
		.lable{
			font-size: 28rpx;
			font-weight: 600;
			color: #131415;
			line-height: 40rpx;
			min-width: 140rpx;
		}
		.input{
			flex: 1;
			margin-left: 6rpx;
			color: #FFFFFF !important;
			font-size: 26rpx;
		}
	}
	.btn{
		margin: 56rpx auto
		::v-deep button{
			color: #FFF;
			background:#000;
			border: 0;
			height: 82rpx;
			border-radius: 9rpx;
			&.u-button--disabled{
				opacity: 1;
				color: #979797;
				background: #252525;
			}
		}
	}
}
</style>
